<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>房源占比前十南丁格尔玫瑰图</title>
    <script src="../static/echarts.min.js"></script>
</head>
<body>
<div id="main" style="width:800px;height:600px"></div>
<script type="text/javascript">
      // 基于准备好的dom，初始化echarts实例
      var myChart = echarts.init(document.getElementById('main'));

      option = {
       title: {
        text: '房源占比前十南丁格尔玫瑰图'
      },
      tooltip:{},
      legend: {
        top: 'bottom'
      },
      toolbox: {
        show: true,
        feature: {
          mark: { show: true },
          dataView: { show: true, readOnly: false },
          restore: { show: true },
          saveAsImage: { show: true }
        }
      },
      series: [
        {
          name: '房源占比',
          type: 'pie',
          radius: [50, 250],
          center: ['50%', '50%'],
          roseType: 'area',
          itemStyle: {
            borderRadius: 8
          },
          data: [
            {% for data in datas %}
            {value:{{datas[data]}},name: '{{data}}'},
            {% endfor %}
          ]
        }
      ]
};

      // 使用刚指定的配置项和数据显示图表。
      myChart.setOption(option);




</script>

</body>
</html>